<template>
  <div class="popup-controls">
    <button @click=";(open = !open), $emit('toggle')" class="rounded-button me-2">
      <icon-chevron-down v-if="open" />
      <icon-chevron-up v-else />
    </button>
    <button @click="$emit('close')" class="rounded-button">
      <icon-times />
    </button>
  </div>
</template>

<script setup>
import { ref } from 'vue'

const open = ref(true)
</script>

<style scoped>
.rounded-button svg {
  fill: #f7f7f7;
}
.rounded-button {
  background: #212529;
}
.rounded-button:hover {
  background: #31363b;
}
</style>
